$(function () {
    $('#media-library #FileListContainer #FileList li').live('click', function () {
        var img = $(this).find("img").clone();
        img.attr('width', '100');
        img.attr('height', '100');
        $("#media-library #ImagePreview").html(img);
    });
});

function onFolderChanged_media_library() {
    var folder = $('#media-library #Directories').val();
    $('#media-library #FileListContainer').empty();
    var root = $('#WebRoots_GetWebRoot').val();
    $("#media-library #FileListContainer").
    load(root + 'Admin/Scripts/media-library/media-library.aspx?Folder=' + folder + ' #FileList');
}

function media_library(PasteControl, LinkControl, HtmlControl) {

    $('#dialog-window').remove();
    // the following line relies on the admin theme.  dependencies[ dialog_container ]
    $('#dialog_container').html('<div id="dialog-window" title="Add an Image"></div>');
    var root = $('#WebRoots_GetWebRoot').val();
    $.post(root + 'Admin/Scripts/media-library/media-library.aspx', function (data) {
        $('#dialog-window').html(data);
        $('#media-library').tabs();
        $('#dialog-window').dialog({
            modal: true,
            draggable: true,
            resizable: false,
            height: 550,
            width: 600,
            overlay: { backgroundColor: "#000", opacity: 0.5 },
            buttons: {
                "Cancel": function () { $(this).dialog('close'); },
                "Add": function () {
                    $(this).dialog('close');
                    // add image from a given url
                    if ($('#media-library ul .ui-state-active a').attr('href') == '#from-url') {
                        if ($("#ImageURL").val() != '') {
                            var image = '<img title=';
                            image += $("#ImageTitle").val();
                            image += ' src='
                            image += $("#ImageURL").val();
                            image += ' alt='
                            image += $("#ImageAlt").val();
                            image += ' width='
                            image += $("#ImageWidth").val();
                            image += ' height='
                            image += $("#ImageHeight").val();
                            image += ' />';
                            PasteControl.pasteHTML(image);
                        }
                    }
                    // add image from the media library
                    if ($('#media-library ul .ui-state-active a').attr('href') == '#media') {
                        if ($("#ImagePreview").html() != '') {
                            if (LinkControl) {
                                var image_src = $("#ImagePreview").find("img").attr("title");
                                $(LinkControl).val(image_src);
                            }
                            if (HtmlControl) {
                                $(HtmlControl).html($("#ImagePreview").html());
                            }
                            if (PasteControl) {
                                var image_alt = $("#image_alt").val();
                                var image_width = $("#image_width").val();
                                var image_height = $("#image_height").val();
                                if (image_alt != '')
                                    $("#ImagePreview").find("img").attr("alt", image_alt);
                                if (image_width != '')
                                    $("#ImagePreview").find("img").attr("width", image_width);
                                if (image_height != '')
                                    $("#ImagePreview").find("img").attr("height", image_height);
                                PasteControl.pasteHTML($("#ImagePreview").html());
                            }
                        }
                    }
                } //save
            }//buttons
        });
    });
}